<template>
    <section class="smart_resource_table_common">
        	<el-table
        		stripe
        		v-loading="loading"
			    :data="tableData"
			   >
			    <el-table-column v-if="tableType==='alert'" type="selection" width="55"></el-table-column>
			 
			    <el-table-column v-if="tableType!='alert'"  label='序号' align="center" width="80px">
			     	<template slot-scope="scope">
				        <span style="margin-left: 10px">{{Number(scope.$index)+1}}</span>
				      </template>
			    </el-table-column>
			    
			    <el-table-column
			      v-for="(val,key) in tableTitle"
			      :prop="key"
			      :label="val"
			      align="center"
			      >
			    </el-table-column>
			    
			     <el-table-column  label='操作' align="center"   width="180">
			     	<template slot-scope="scope">
			     		  <div  v-if="tableType!='alert'">
			     		  	<span class="diy_pic button-click"  @click="peizhi(scope)" ><img style="width: 20px;" src="../../../images/service08.png"/></span>
			     		  	<span class="diy_pic button-click"  @click="detail(scope)" ><img src="../../../images/server02.png"/></span>
			     		  	<span class="diy_pic button-click"   @click="del(scope)" ><img src="../../../images/server04.png"/></span>
			     		  </div>
			     		 <div v-if="tableType==='alert'">
			     		 	<span class="diy_pic button-click"  @click="peizhi(scope)" >处理报警</span>
			     		  	<span class="diy_pic button-click"  @click="detail(scope)" >查看详情</span>
			     		 </div>
			     	</template>
				    
			    </el-table-column>
			   
			  </el-table>
			  <p style="margin-top: 15px;">
			  	<el-pagination
				  background
				  @current-change="handleCurrentChange"
				  layout="prev, pager, next"
				  :total="total">
				</el-pagination>
			  </p>
			   
    </section>
</template>

<script>
    
    export default {
    	props:{
    		tableType:{
    			type:String,
    			default:'',
    		},
    		tableTitle:Object,
    		tableData:Array,
    		total:Number,
    		loading:Boolean
    	},
        data() {
          return {
          	
          };
        },
        methods: {
        	detail(scope){
        		this.$emit('detail',scope);
        	},
        	del(scope){
        		console.log(scope);
			    this.$emit('del',scope);
        	},
        	handleCurrentChange(val) {
		         this.$emit('handleCurrentChange',val);
		    },
		    peizhi(val){
		    	this.$emit('peizhi',val);
		    }
        }
  };
</script>

<style>
	span.diy_pic{
		color: #2576c5;
		    margin-left: 10px;
   			 vertical-align: text-bottom;
	}
    .smart_resource_table_common .diy_pic img{
    	width: 24px;
    	    vertical-align: middle;
    }
   .smart_resource_table_common .el-table th.is-leaf{
    	background: #cae4fd;
    	color: #4a4848;
    }
</style>